<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../../../resources/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../../../../resources/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
		<!--搜索条件开始-->
        <fieldset class="layui-elem-field layuimini-search">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" lay-filter="searchFrm" id="searchFrm" name="searchFrm" method="post">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">登录名称</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="loginname" id="loginname" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">登录IP</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="loginip" id="loginip" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">开始时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="startTime" id="startTime" readonly="readonly" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">结束时间</label>
                                <div class="layui-input-inline">
                                    <input type="tel" name="endTime" id="endTime" readonly="readonly" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item" style="text-align: center">
                            <div class="layui-inline">
                                <button type="button" class="layui-btn layui-btn-normal  layui-icon layui-icon-search" lay-filter="doSearch" lay-submit="">查询</button>
                                <button type="reset" class="layui-btn layui-icon layui-icon-refresh">重置</button>
                            </div>
                        </div>
                    </form>
            </div>
        </fieldset>
		<!--搜索条件结束-->
    
	
	<!--数据表格开始-->
	
	    <table class="layui-hide" id="logInfoTable" lay-filter="logInfoTable"></table>
	    <div id="loginfoToolBar" style="display: none;">
	        <button type="button" lay-event="batchDelete" class="layui-btn layui-btn-sm layui-btn-danger"><span class="layui-icon layui-icon-delete"></span>批量删除</button>
	    </div>
	    <div id="loginfoRowBar" style="display: none">
	        <button type="button" lay-event="delete" class="layui-btn layui-btn-sm layui-btn-danger"><span class="layui-icon layui-icon-delete"></span>删除</button>
	    </div>
	</div>
	<!--数据表格结束-->
</div>

<script src="../../../../resources/lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../../../resources/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../../../../resources/lib/jq-module/jquery.particleground.min.js" charset="utf-8"></script>
<script src="../../../../resources/common/jquery.cookie.min.js" charset="utf-8"></script>
<script src="../../../../resources/common/common.js" charset="utf-8"></script>


<script>
    layui.use(['layer','form','laydate','table'], function () {
        var form=layui.form;
		var layer=layui.layer;
		var laydate=layui.laydate;
		var table=layui.table;


		//渲染时间选择器
        laydate.render({
            elem:'#startTime',
            type:'datetime'
        })

        laydate.render({
            elem:'#endTime',
            type:'datetime'
        })
        var tableIndex;
        
		tableIndex = table.render({
			elem: '#logInfoTable'
			,url: api+'loginfo/loadAllLoginfo'
			,toolbar: '#loginfoToolBar' //开启头部工具栏，并为其绑定左侧模板
			,title: '登录日志表'
			
			,page: true
			,cols: [ [
				{type: 'checkbox', fixed: 'left'}
				,{field:'id', title:'ID',align:'center'}
				,{field:'loginname', title:'登录名',align:'center'}
				,{field:'loginip', title:'登录IP',align:'center'}
				,{field:'logintime', title:'登录时间',align:'center'}
				,{fixed: 'right', title:'操作', toolbar: '#loginfoRowBar',align:'center'}
			] ]
			,done:function(data,curr,count){
				//不是第一页如果返回的数据为0那么就返回上一页
				if(data.data.length==0&&curr!=1){
					tableIndex.reload({
						page:{
							curr:curr-1
						}
					});
				}
			}
		});
		
        //模糊查询
		form.on('submit(doSearch)',function(data){
			var params = $("#searchFrm").serialize();
			tableIndex.reload({
				url: api+'loginfo/loadAllLoginfo?'+ params,
				page:{
					curr:1
				}
			})
			return false;
		});
		
		//头工具栏事件
		table.on('toolbar(logInfoTable)', function(obj){
			switch(obj.event){
				case 'batchDelete':
					BatchDelete();
					break;
			};
		});
		//监听行工具条的事件
		table.on("tool(logInfoTable)",function(obj){
			var data = obj.data; //获得当前行数据
			switch(obj.event){
				case 'delete':
					DeleteLoginfo(data);
					break;
			};
		});

		//批量删除
		function BatchDelete() {
			//得到选中行
			var checkStatus = table.checkStatus('logInfoTable');
			var dataLength = checkStatus.data.length;
			console.log(dataLength);
			if (dataLength>0){
				layer.confirm('你确定要删除这些数据吗?', {icon: 3, title:'提示'}, function(index){
					var data = checkStatus.data; //获取选中行的数据
					var ids = '';
					$.each(data,function (index,item) {
						if (index == 0){
							ids += 'ids='+ item.id;
						}else{
							ids += '&ids='+ item.id;
						}
					})
					$.post(api+"loginfo/batchDeleteLoginfo",ids,function (res) {
						if(res.code==200){
							tableIndex.reload({});
						}
						layer.msg(res.msg);
					})
					layer.close(index);
				})
			}else{
				layer.msg("请选中行");
			}
		}

		//删除
		function  DeleteLoginfo(data) {
			layer.confirm('你确定要删除这条数据吗?', {icon: 3, title:'提示'}, function(index){
				$.post(api+"loginfo/deleteLoginfo",{id:data.id},function(res){
					if(res.code==200){
						tableIndex.reload();
					}
					layer.msg(res.msg);
				})
				layer.close(index);
			});
		}

    });
</script>
</body>
</html>